<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        input{
            text-align: center;
            color:red;
            margin-right: 50px;
        }
        p{
            font-size: 15px;
        }
    </style>
</head>
<body>
    <div>
       <input type="button" value="-" id="btn1" >
       <input type="button" value="+" id="btn2" >

    </div>
    <div>
        <h2>江城子·乙卯正月二十日夜记梦</h2>
        <div id="txt">
            <p id="p">
                十年生死两茫茫，不思量，自难忘。<br>
                千里孤坟，无处话凄凉。<br>
                纵使相逢应不识，尘满面，鬓如霜。<br>
                夜来幽梦忽还乡，小轩窗，正梳妆。<br>
                相顾无言，惟有泪千行。<br>
                料得年年肠断处，明月夜，短松冈。
            </p>
        </div>
    </div>

    <script>
        window.onload = function(){
            var ptxt = document.getElementById('p');
            var btn1=document.getElementById("btn1");
            var btn2=document.getElementById("btn2");

            var num = 15;
            btn1.onclick = function(){
                num =  num - 5;
                if(ptxt.style.fontSize<=15){
                ptxt.style.fontSize = '15px'
                }else if(ptxt.style.fontSize>=40){
                ptxt.style.fontSize='40px'
                }else{
                ptxt.style.fontSize = num + 'px'; 
            }
              
            }
            btn2.onclick = function(){
                num =  num + 5;
                if(ptxt.style.fontSize<=15){
                ptxt.style.fontSize = '15px'
                }else if(ptxt.style.fontSize>=40){
                ptxt.style.fontSize='40px'
                }else{
                ptxt.style.fontSize = num + 'px'; 
            }
            
            }
        }
    </script>
</body>
</html>